<template>
    <div>
        <el-form ref="form" :model="login" label-width="80px">
            <el-form-item label="账号">
                <el-input v-model="login.name"></el-input>
            </el-form-item>
            <el-form-item label="密码">
                <el-input v-model="login.password"></el-input>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="onLogin">登录</el-button>
                <el-button type="primary" @click="onReg">登录</el-button>
            </el-form-item>
        </el-form>
    </div>
</template>
<script>
import { Form, FormItem, Input, Button ,message} from 'element-ui'
import { test1, test2, login } from '../api/login'
export default {
    components: {
        'el-form': Form,
        'el-form-item': FormItem,
        'el-button': Button,
        'el-input': Input
    },
    data: function () {
        return {
            login: {
                name: '',
                password: ''
            }
        }
    },
    methods: {
        onLogin: async function () {
            const { data, msg } = await login(this.login);
            if (msg === '登录成功') {
                message({
                    showClose: true,
                    message: msg,
                    type:'success'
                });
                //动态生成路由
                console.log(data,'data');
                data.power.forEach(v => {
                    this.$router.addRoute('home', { path: v.path, component: () => import(/* webpackChunkName: "layout" */ `@/views/${v.component}`) })
                });

                sessionStorage.setItem('power',JSON.stringify(data.power));
                sessionStorage.setItem('user',JSON.stringify(data.user));
                sessionStorage.setItem('token',data.token);
                this.$router.push('/home/student');
            }else{
                message({
                    showClose: true,
                    message: msg,
                    type:'error'
                })
            }


            //发送请求
            /* axios.get('/test1',{params:{b:2}}).then((res)=>{
                console.log(res);
            }) */
            // this.$axios.post('/test2',{a:1}).then((res)=>{
            //     console.log(res);
            // })
            /* this.$axios.get('/test1',{params:{b:2}}).then((res)=>{
                console.log(res);
            }) */
            /* api接口的写法 */
            // const {data,msg}=await test1(this.login);
            // if(msg==='成功'){
            //this.$router.push({name:'student'})
            //}

        },
        onReg: function () {
            test2(this.login).then(({ data }) => {
                console.log(data);
            })
        }
    }
}
</script>